<template>
  <div class="bank-info">
    <Title :title="title">
      <slot />
    </Title>
    <div style="padding: 0 6px;">
      <el-empty v-if="list.length === 0" :description="description" />
      <el-row
        v-for="(item, index) in list"
        :key="index"
      >
        <el-col :span="6" style="margin-top: 22px">
          <span>卡号：</span>
          <span>{{ item.bankCardNo }}</span>
        </el-col>
        <el-col :span="6" style="margin-top: 22px">
          <span>账户名：</span>
          <span>{{ item.bankAccountName }}</span>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import Title from '@/components/Title'
export default {
  name: 'BankInfoCard',
  components: {
    Title
  },
  props: {
    title: {
      type: String,
      default: ''
    },
    description: {
      type: String,
      default: ''
    },
    list: {
      type: Array,
      default: () => []
    }
  }
}
</script>

<style lang="scss" scoped>
.bank-info {
  font-size: 14px;
  header {
    padding: 6px;
    font-weight: bold;
    background: #eee;
  }
}
</style>
